//COLORS
var Colors = {
    pot1:0x696969,
    pot2:0x708090,
    pot3:0xA9A9A9,

    red:0xFF0000,
    white:0xd8d0d1,
    brown:0x59332e,
    pink:0xF5986E,
    brownDark:0x23190f,
    blue:0x68c3c0,
    auqamarin:0x7FFFAA,
    green:0x32CD32,
    darkGreen:0x006400,
    salmon:0xFA8072,
    darkRed:0x8B0000,
    lightGrey:0xD3D3D3,
    gold:0xFFA07A,
    orange:0xF08080,
    yellow:0xFAEBD7,
    ghostWhite:0xFFFFFF,
    linen:0xFAF0E6,
    gray:0x808000,
    black:0x000000
};

// THREEJS RELATED VARIABLES

var scene,
    camera, fieldOfView, aspectRatio, nearPlane, farPlane,
    renderer, container;

//SCREEN & MOUSE VARIABLES

var HEIGHT, WIDTH,
    mousePos = { x: 0, y: 0 };

//INIT THREE JS, SCREEN AND MOUSE EVENTS

function createScene() {

  HEIGHT = window.innerHeight;
  WIDTH = window.innerWidth;

  scene = new THREE.Scene();
  aspectRatio = WIDTH / HEIGHT;
  fieldOfView = 60;
  nearPlane = 1;
  farPlane = 10000;
  camera = new THREE.PerspectiveCamera(
    fieldOfView,
    aspectRatio,
    nearPlane,
    farPlane
    );
  scene.fog = new THREE.Fog(0xf7d9aa, 100,950);
  camera.position.x = 0;
  camera.position.z = 200;
  camera.position.y = 100;

  renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
  renderer.setSize(WIDTH, HEIGHT);
  renderer.shadowMap.enabled = false;
  container = document.getElementById('world');
  container.appendChild(renderer.domElement);

  window.addEventListener('resize', handleWindowResize, false);
}

// HANDLE SCREEN EVENTS

function handleWindowResize() {
  HEIGHT = window.innerHeight;
  WIDTH = window.innerWidth;
  renderer.setSize(WIDTH, HEIGHT);
  camera.aspect = WIDTH / HEIGHT;
  camera.updateProjectionMatrix();
}


// LIGHTS

var ambientLight, hemisphereLight, shadowLight;

function createLights() {

  hemisphereLight = new THREE.HemisphereLight(0xaaaaaa,0x000000, .9)
  shadowLight = new THREE.DirectionalLight(0xffffff, .9);
  shadowLight.position.set(150, 350, 350);
  shadowLight.castShadow = true;
  shadowLight.shadow.camera.left = -400;
  shadowLight.shadow.camera.right = 400;
  shadowLight.shadow.camera.top = 400;
  shadowLight.shadow.camera.bottom = -400;
  shadowLight.shadow.camera.near = 1;
  shadowLight.shadow.camera.far = 1000;
  shadowLight.shadow.mapSize.width = 2048;
  shadowLight.shadow.mapSize.height = 2048;

  scene.add(hemisphereLight);
  scene.add(shadowLight);
}


var Lajiao = function() {
  this.mesh = new THREE.Object3D();
  this.mesh.name = "laJiao";

  positionArr = [
    // 底部
    { x: 0, y: 0, z: 0, color: Colors.darkRed },

    // 2
    { x: 0, y: 10, z: 0, color: Colors.red },
    { x: 0, y: 10, z: -10, color: Colors.red },
    { x: 0, y: 10, z: 10, color: Colors.red },

    { x: 10, y: 10, z: 0, color: Colors.darkRed },
    { x: 10, y: 10, z: 10, color: Colors.darkRed },
    { x: 10, y: 10, z: -10, color: Colors.darkRed },
    // 3
    { x: 10, y: 20, z: 0, color: Colors.red },
    { x: 10, y: 20, z: 10, color: Colors.red },
    { x: 10, y: 20, z: -10, color: Colors.red },

    { x: 20, y: 20, z: 0, color: Colors.darkRed },
    { x: 20, y: 20, z: 10, color: Colors.darkRed },
    { x: 20, y: 20, z: -10, color: Colors.darkRed },
    // 4
    { x: 10, y: 30, z: 0, color: Colors.red },
    { x: 10, y: 30, z: -10, color: Colors.red },

    { x: 20, y: 30, z: 0, color: Colors.darkRed },
    { x: 20, y: 30, z: 20, color: Colors.darkRed },
    { x: 20, y: 30, z: -20, color: Colors.darkRed },

    { x: 30, y: 30, z: 0, color: Colors.darkRed },
    // { x: 30, y: 30, z: 10, color: Colors.red },
    // 5
    { x: 20, y: 40, z: 0, color: Colors.red },
    { x: 20, y: 40, z: 20, color: Colors.red },
    { x: 20, y: 40, z: -20, color: Colors.red },

    { x: 30, y: 40, z: 0, color: Colors.darkRed },
    { x: 30, y: 40, z: 10, color: Colors.darkRed },
    { x: 30, y: 40, z: -10, color: Colors.darkRed },
    // 6
    { x: 20, y: 50, z: 0, color: Colors.red },
    { x: 20, y: 50, z: 20, color: Colors.red },
    { x: 20, y: 50, z: -20, color: Colors.red },

    { x: 30, y: 50, z: 0, color: Colors.darkRed },
    { x: 30, y: 50, z: 10, color: Colors.darkRed },
    { x: 30, y: 50, z: -10, color: Colors.darkRed },
    // 7
    { x: 10, y: 60, z: 0, color: Colors.red },

    { x: 20, y: 60, z: 0, color: Colors.red },
    { x: 20, y: 60, z: 20, color: Colors.red },
    { x: 20, y: 60, z: -20, color: Colors.red },

    { x: 30, y: 60, z: 0, color: Colors.darkRed },
    { x: 30, y: 60, z: 10, color: Colors.darkRed },
    { x: 30, y: 60, z: -10, color: Colors.darkRed },
    // 8
    { x: 10, y: 70, z: 0, color: Colors.salmon },
    { x: 10, y: 70, z: 10, color: Colors.salmon },
    { x: 10, y: 70, z: -10, color: Colors.salmon },

    { x: 20, y: 70, z: 0, color: Colors.red },
    { x: 20, y: 70, z: 20, color: Colors.red },
    { x: 20, y: 70, z: -20, color: Colors.red },

    { x: 30, y: 70, z: 0, color: Colors.red },
    { x: 30, y: 70, z: 10, color: Colors.red },
    { x: 30, y: 70, z: -10, color: Colors.red },
    // 9
    { x: 10, y: 80, z: 0, color: Colors.red },
    { x: 10, y: 80, z: 10, color: Colors.red },
    { x: 10, y: 80, z: -10, color: Colors.red },

    { x: 20, y: 80, z: 0, color: Colors.red },
    { x: 20, y: 80, z: 20, color: Colors.red },
    { x: 20, y: 80, z: -20, color: Colors.red },

    { x: 30, y: 80, z: 0, color: Colors.red },
    { x: 30, y: 80, z: 10, color: Colors.red },
    { x: 30, y: 80, z: -10, color: Colors.red },
    // 10
    { x: 0, y: 90, z: 0, color: Colors.red },

    { x: 10, y: 90, z: 0, color: Colors.ghostWhite },
    { x: 10, y: 90, z: 10, color: Colors.ghostWhite },
    { x: 10, y: 90, z: -10, color: Colors.ghostWhite },

    { x: 20, y: 90, z: 0, color: Colors.red },
    { x: 20, y: 90, z: 20, color: Colors.red },
    { x: 20, y: 90, z: -20, color: Colors.red },

    { x: 30, y: 90, z: 0, color: Colors.darkRed },
    { x: 30, y: 90, z: 10, color: Colors.darkRed },
    { x: 30, y: 90, z: -10, color: Colors.darkRed },
    // 11
    { x: 0, y: 100, z: 0, color: Colors.ghostWhite },
    { x: 0, y: 100, z: -10, color: Colors.ghostWhite },

    { x: 10, y: 100, z: 0, color: Colors.red },
    { x: 10, y: 100, z: 10, color: Colors.red },
    { x: 10, y: 100, z: -10, color: Colors.red },

    { x: 20, y: 100, z: 0, color: Colors.darkRed },
    { x: 20, y: 100, z: 20, color: Colors.darkRed },
    { x: 20, y: 100, z: -20, color: Colors.darkRed },

    { x: 30, y: 100, z: 0, color: Colors.darkRed },
    { x: 30, y: 100, z: 10, color: Colors.darkRed },
    { x: 30, y: 100, z: -10, color: Colors.darkRed },
    
    // 12
    { x: 10, y: 110, z: 0, color: Colors.red },
    { x: 10, y: 110, z: 10, color: Colors.red },
    { x: 10, y: 110, z: -10, color: Colors.red },
    
    { x: 20, y: 110, z: 0, color: Colors.darkRed },
    { x: 20, y: 110, z: 20, color: Colors.darkRed },
    { x: 20, y: 110, z: -20, color: Colors.darkRed },

    // 头部
    { x: 10, y: 120, z: 0, color: Colors.green },
    { x: 10, y: 120, z: -10, color: Colors.green },
    { x: 10, y: 120, z: 10, color: Colors.green },

    { x: 0, y: 130, z: 0, color: Colors.green },
    { x: 0, y: 130, z: 10, color: Colors.green },
    { x: 0, y: 130, z: -10, color: Colors.green },

    { x: 10, y: 130, z: 0, color: Colors.darkGreen },
    { x: 10, y: 130, z: -10, color: Colors.darkGreen },
    { x: 10, y: 130, z: 10, color: Colors.darkGreen },
  ]

  for(var i = 0, len = positionArr.length; i < len; i++) {
    var { x = 0, y = 0, z = 0, color } = positionArr[i]
    x = x - 100
    y = y + 200
    var geomSqare = new THREE.BoxGeometry(10,10,10,1,1,1);
    var matCockpit = new THREE.MeshPhongMaterial({color:color, shading:THREE.FlatShading});
    var sqare = new THREE.Mesh(geomSqare, matCockpit);
    sqare.position.set(x, y, z);
    sqare.castShadow = true;
    sqare.receiveShadow = true;
    this.mesh.add(sqare);
  }
}

var Qingjiao = function() {
  this.mesh = new THREE.Object3D();
  this.mesh.name = "qingJiao";

  positionArr = [
    // 底部
    // 1
    { x: 20, y: 0, z: 0, color: Colors.darkGreen },

    { x: 30, y: 0, z: 0, color: Colors.darkGreen },
    { x: 30, y: 0, z: 10, color: Colors.darkGreen },
    { x: 30, y: 0, z: -10, color: Colors.darkGreen },

    { x: 50, y: 0, z: 0, color: Colors.green },
    { x: 50, y: 0, z: 10, color: Colors.green },
    { x: 50, y: 0, z: -10, color: Colors.darkGreen },

    { x: 60, y: 0, z: 0, color: Colors.darkGreen },

    // 2
    { x: 20, y: 10, z: 0, color: Colors.darkGreen },

    { x: 30, y: 10, z: 0, color: Colors.darkGreen },
    { x: 30, y: 10, z: 10, color: Colors.darkGreen },
    { x: 30, y: 10, z: -10, color: Colors.darkGreen },

    { x: 40, y: 10, z: 0, color: Colors.green },
    { x: 40, y: 10, z: 20, color: Colors.green },
    { x: 40, y: 10, z: -20, color: Colors.darkGreen },

    { x: 50, y: 10, z: 0, color: Colors.green },
    { x: 50, y: 10, z: 20, color: Colors.green },
    { x: 50, y: 10, z: -20, color: Colors.darkGreen },

    { x: 60, y: 10, z: 0, color: Colors.green },
    { x: 60, y: 10, z: 10, color: Colors.green },
    { x: 60, y: 10, z: -10, color: Colors.darkGreen },

    { x: 70, y: 10, z: 0, color: Colors.darkGreen },

    // 3
    { x: 20, y: 20, z: 0, color: Colors.darkGreen },

    { x: 30, y: 20, z: 0, color: Colors.darkGreen },
    { x: 30, y: 20, z: 10, color: Colors.darkGreen },
    { x: 30, y: 20, z: -10, color: Colors.darkGreen },

    { x: 40, y: 20, z: 0, color: Colors.darkGreen },
    { x: 40, y: 20, z: 20, color: Colors.darkGreen },
    { x: 40, y: 20, z: -20, color: Colors.darkGreen },

    { x: 50, y: 20, z: 0, color: Colors.green },
    { x: 50, y: 20, z: 20, color: Colors.green },
    { x: 50, y: 20, z: -20, color: Colors.darkGreen },

    { x: 60, y: 20, z: 0, color: Colors.green },
    { x: 60, y: 20, z: 10, color: Colors.green },
    { x: 60, y: 20, z: -10, color: Colors.darkGreen },

    { x: 70, y: 20, z: 0, color: Colors.green },

    // 4
    { x: 10, y: 30, z: 0, color: Colors.darkGreen },

    { x: 20, y: 30, z: 0, color: Colors.darkGreen },
    { x: 20, y: 30, z: 10, color: Colors.darkGreen },
    { x: 20, y: 30, z: -10, color: Colors.darkGreen },

    { x: 30, y: 30, z: 0, color: Colors.darkGreen },
    { x: 30, y: 30, z: 20, color: Colors.darkGreen },
    { x: 30, y: 30, z: -20, color: Colors.darkGreen },

    { x: 40, y: 30, z: 0, color: Colors.darkGreen },
    { x: 40, y: 30, z: 30, color: Colors.darkGreen },
    { x: 40, y: 30, z: -30, color: Colors.darkGreen },

    { x: 50, y: 30, z: 0, color: Colors.green },
    { x: 50, y: 30, z: 20, color: Colors.green },
    { x: 50, y: 30, z: -20, color: Colors.darkGreen },

    { x: 60, y: 30, z: 0, color: Colors.green },
    { x: 60, y: 30, z: 10, color: Colors.green },
    { x: 60, y: 30, z: -10, color: Colors.darkGreen },

    { x: 70, y: 30, z: 0, color: Colors.green },

    // 5
    { x: 10, y: 40, z: 0, color: Colors.darkGreen },

    { x: 20, y: 40, z: 0, color: Colors.darkGreen },
    { x: 20, y: 40, z: 10, color: Colors.darkGreen },
    { x: 20, y: 40, z: -10, color: Colors.darkGreen },

    { x: 30, y: 40, z: 0, color: Colors.darkGreen },
    { x: 30, y: 40, z: 20, color: Colors.darkGreen },
    { x: 30, y: 40, z: -20, color: Colors.darkGreen },

    { x: 40, y: 40, z: 0, color: Colors.green },
    { x: 40, y: 40, z: 30, color: Colors.green },
    { x: 40, y: 40, z: -30, color: Colors.darkGreen },

    { x: 50, y: 40, z: 0, color: Colors.green },
    { x: 50, y: 40, z: 30, color: Colors.green },
    { x: 50, y: 40, z: -30, color: Colors.darkGreen },

    { x: 60, y: 40, z: 0, color: Colors.green },
    { x: 60, y: 40, z: 20, color: Colors.green },
    { x: 60, y: 40, z: -20, color: Colors.darkGreen },

    { x: 70, y: 40, z: 0, color: Colors.darkGreen },
    { x: 70, y: 40, z: 10, color: Colors.darkGreen },
    { x: 70, y: 40, z: -10, color: Colors.darkGreen },

    { x: 80, y: 40, z: 0, color: Colors.green },

    // 6
    { x: 10, y: 50, z: 0, color: Colors.darkGreen },

    { x: 20, y: 50, z: 0, color: Colors.darkGreen },
    { x: 20, y: 50, z: 10, color: Colors.darkGreen },
    { x: 20, y: 50, z: -10, color: Colors.darkGreen },

    { x: 30, y: 50, z: 0, color: Colors.darkGreen },
    { x: 30, y: 50, z: 20, color: Colors.darkGreen },
    { x: 30, y: 50, z: -20, color: Colors.darkGreen },

    { x: 40, y: 50, z: 0, color: Colors.green },
    { x: 40, y: 50, z: 30, color: Colors.green },
    { x: 40, y: 50, z: -30, color: Colors.darkGreen },

    { x: 50, y: 50, z: 0, color: Colors.green },
    { x: 50, y: 50, z: 30, color: Colors.green },
    { x: 50, y: 50, z: -30, color: Colors.darkGreen },

    { x: 60, y: 50, z: 0, color: Colors.green },
    { x: 60, y: 50, z: 20, color: Colors.green },
    { x: 60, y: 50, z: -20, color: Colors.darkGreen },

    { x: 70, y: 50, z: 0, color: Colors.darkGreen },
    { x: 70, y: 50, z: 10, color: Colors.darkGreen },
    { x: 70, y: 50, z: -10, color: Colors.darkGreen },

    { x: 80, y: 50, z: 0, color: Colors.green },

    // 7
    { x: 0, y: 60, z: 0, color: Colors.darkGreen },

    { x: 10, y: 60, z: 0, color: Colors.darkGreen },
    { x: 10, y: 60, z: 10, color: Colors.darkGreen },
    { x: 10, y: 60, z: -10, color: Colors.darkGreen },

    { x: 20, y: 60, z: 0, color: Colors.darkGreen },
    { x: 20, y: 60, z: 20, color: Colors.darkGreen },
    { x: 20, y: 60, z: -20, color: Colors.darkGreen },

    { x: 30, y: 60, z: 0, color: Colors.darkGreen },
    { x: 30, y: 60, z: 30, color: Colors.darkGreen },
    { x: 30, y: 60, z: -30, color: Colors.darkGreen },

    { x: 40, y: 60, z: 0, color: Colors.darkGreen },
    { x: 40, y: 60, z: 30, color: Colors.darkGreen },
    { x: 40, y: 60, z: -30, color: Colors.darkGreen },

    { x: 50, y: 60, z: 0, color: Colors.green },
    { x: 50, y: 60, z: 30, color: Colors.green },
    { x: 50, y: 60, z: -30, color: Colors.darkGreen },

    { x: 60, y: 60, z: 0, color: Colors.green },
    { x: 60, y: 60, z: 30, color: Colors.green },
    { x: 60, y: 60, z: -30, color: Colors.darkGreen },

    { x: 70, y: 60, z: 0, color: Colors.darkGreen },
    { x: 70, y: 60, z: 20, color: Colors.darkGreen },
    { x: 70, y: 60, z: -20, color: Colors.darkGreen },

    { x: 80, y: 60, z: 0, color: Colors.auqamarin },
    { x: 80, y: 60, z: 10, color: Colors.auqamarin },
    { x: 80, y: 60, z: -10, color: Colors.darkGreen },

    { x: 90, y: 60, z: 0, color: Colors.green },

    // 8
    { x: 0, y: 70, z: 0, color: Colors.darkGreen },

    { x: 10, y: 70, z: 0, color: Colors.darkGreen },
    { x: 10, y: 70, z: 10, color: Colors.darkGreen },
    { x: 10, y: 70, z: -10, color: Colors.darkGreen },

    { x: 20, y: 70, z: 0, color: Colors.darkGreen },
    { x: 20, y: 70, z: 20, color: Colors.darkGreen },
    { x: 20, y: 70, z: -20, color: Colors.darkGreen },

    { x: 30, y: 70, z: 0, color: Colors.darkGreen },
    { x: 30, y: 70, z: 30, color: Colors.darkGreen },
    { x: 30, y: 70, z: -30, color: Colors.darkGreen },

    // { x: 40, y: 70, z: 0, color: Colors.black },
    // { x: 40, y: 70, z: 10, color: Colors.black },
    // { x: 40, y: 70, z: -10, color: Colors.black },

    { x: 50, y: 70, z: 0, color: Colors.auqamarin },
    { x: 50, y: 70, z: 30, color: Colors.auqamarin },
    { x: 50, y: 70, z: -30, color: Colors.darkGreen },

    { x: 60, y: 70, z: 0, color: Colors.darkGreen },
    { x: 60, y: 70, z: 30, color: Colors.darkGreen },
    { x: 60, y: 70, z: -30, color: Colors.darkGreen },

    { x: 70, y: 70, z: 0, color: Colors.darkGreen },
    { x: 70, y: 70, z: 20, color: Colors.darkGreen },
    { x: 70, y: 70, z: -20, color: Colors.darkGreen },

    { x: 80, y: 70, z: 0, color: Colors.auqamarin },
    { x: 80, y: 70, z: 10, color: Colors.auqamarin },
    { x: 80, y: 70, z: -10, color: Colors.darkGreen },

    { x: 90, y: 70, z: 0, color: Colors.green },
    // { x: 90, y: 70, z: 10, color: Colors.green },
    // { x: 90, y: 70, z: -10, color: Colors.green },

    // 9
    { x: 0, y: 80, z: 0, color: Colors.darkGreen },

    { x: 10, y: 80, z: 0, color: Colors.darkGreen },
    { x: 10, y: 80, z: 10, color: Colors.darkGreen },
    { x: 10, y: 80, z: -10, color: Colors.darkGreen },

    // { x: 20, y: 80, z: 0, color: Colors.black },
    // { x: 20, y: 80, z: 10, color: Colors.black },
    // { x: 20, y: 80, z: -10, color: Colors.black },

    { x: 30, y: 80, z: 0, color: Colors.darkGreen },
    { x: 30, y: 80, z: 20, color: Colors.darkGreen },
    { x: 30, y: 80, z: -20, color: Colors.darkGreen },

    { x: 40, y: 80, z: 0, color: Colors.green },
    { x: 40, y: 80, z: 30, color: Colors.green },
    { x: 40, y: 80, z: -30, color: Colors.darkGreen },

    { x: 50, y: 80, z: 0, color: Colors.darkGreen },
    { x: 50, y: 80, z: 30, color: Colors.darkGreen },
    { x: 50, y: 80, z: -30, color: Colors.darkGreen },

    { x: 60, y: 80, z: 0, color: Colors.green },
    { x: 60, y: 80, z: 30, color: Colors.green },
    { x: 60, y: 80, z: -30, color: Colors.darkGreen },

    { x: 70, y: 80, z: 0, color: Colors.ghostWhite },
    { x: 70, y: 80, z: 20, color: Colors.ghostWhite },
    { x: 70, y: 80, z: -20, color: Colors.darkGreen },

    { x: 80, y: 80, z: 0, color: Colors.green },
    { x: 80, y: 80, z: 10, color: Colors.green },
    { x: 80, y: 80, z: -10, color: Colors.darkGreen },

    { x: 90, y: 80, z: 0, color: Colors.green },

    // 10
    { x: 20, y: 80, z: 0, color: Colors.green },

    // { x: 30, y: 90, z: 0, color: Colors.black },
    // { x: 30, y: 90, z: 10, color: Colors.black },
    // { x: 30, y: 90, z: -10, color: Colors.black },

    { x: 40, y: 90, z: 0, color: Colors.darkGreen },
    { x: 40, y: 90, z: 10, color: Colors.darkGreen },
    { x: 40, y: 90, z: -10, color: Colors.darkGreen },

    { x: 50, y: 90, z: 0, color: Colors.green },
    { x: 50, y: 90, z: 20, color: Colors.green },
    { x: 50, y: 90, z: -20, color: Colors.darkGreen },

    // { x: 60, y: 90, z: 0, color: Colors.black },
    // { x: 60, y: 90, z: 10, color: Colors.black },
    // { x: 60, y: 90, z: -10, color: Colors.black },

    { x: 70, y: 90, z: 0, color: Colors.green },
    { x: 70, y: 90, z: 10, color: Colors.green },
    { x: 70, y: 90, z: -10, color: Colors.darkGreen },

    { x: 80, y: 90, z: 0, color: Colors.green },

    // 11
    { x: 40, y: 100, z: 0, color: Colors.green },
    { x: 40, y: 100, z: 10, color: Colors.green },
    { x: 40, y: 100, z: -10, color: Colors.darkGreen },

    // 12
    { x: 30, y: 110, z: 0, color: Colors.green },
    { x: 30, y: 110, z: 10, color: Colors.green },
    { x: 30, y: 110, z: -10, color: Colors.darkGreen },

    { x: 40, y: 110, z: 0, color: Colors.green },
    { x: 40, y: 110, z: 10, color: Colors.green },
    { x: 40, y: 110, z: -10, color: Colors.darkGreen },

  ]

  for(var i = 0, len = positionArr.length; i < len; i++) {
    var { x = 0, y = 0, z = 0, color } = positionArr[i]
    x = x - 80
    y = y + 0
    z = z - 0
    var geomSqare = new THREE.BoxGeometry(10,10,10,1,1,1);
    var matCockpit = new THREE.MeshPhongMaterial({color:color, shading:THREE.FlatShading});
    var sqare = new THREE.Mesh(geomSqare, matCockpit);
    sqare.position.set(x, y, z);
    sqare.castShadow = true;
    sqare.receiveShadow = true;
    this.mesh.add(sqare);
  }
}

var Jitui = function() {
  this.mesh = new THREE.Object3D();
  this.mesh.name = "jiTui";

  positionArr = [
    // 上部
    // 9
    { x: 0, y: 80, z: 0, color: Colors.lightGrey },
    { x: 0, y: 80, z: -10, color: Colors.lightGrey },

    { x: 10, y: 80, z: 0, color: Colors.ghostWhite },
    { x: 10, y: 80, z: -10, color: Colors.ghostWhite },

    // 8
    { x: 0, y: 70, z: 0, color: Colors.ghostWhite },
    { x: 0, y: 70, z: 10, color: Colors.ghostWhite },
    { x: 0, y: 70, z: -10, color: Colors.ghostWhite },

    { x: 10, y: 70, z: 0, color: Colors.ghostWhite },
    { x: 10, y: 70, z: 10, color: Colors.ghostWhite },
    { x: 10, y: 70, z: -10, color: Colors.ghostWhite },

    // 7
    { x: 10, y: 60, z: 0, color: Colors.lightGrey },
    { x: 10, y: 60, z: 10, color: Colors.lightGrey },
    { x: 10, y: 60, z: -10, color: Colors.lightGrey },

    { x: 20, y: 60, z: 0, color: Colors.ghostWhite },

    // 6
    { x: 20, y: 50, z: 0, color: Colors.gold },
    { x: 20, y: 50, z: 10, color: Colors.gold },
    { x: 20, y: 50, z: -10, color: Colors.gold },

    { x: 30, y: 50, z: 0, color: Colors.orange },
    { x: 30, y: 50, z: 20, color: Colors.orange },
    { x: 30, y: 50, z: -20, color: Colors.orange },

    // 5
    { x: 20, y: 40, z: 0, color: Colors.orange },
    { x: 20, y: 40, z: 10, color: Colors.orange },
    { x: 20, y: 40, z: -10, color: Colors.orange },

    { x: 30, y: 40, z: 0, color: Colors.gold },
    { x: 30, y: 40, z: 20, color: Colors.gold },
    { x: 30, y: 40, z: -20, color: Colors.gold },

    { x: 40, y: 40, z: 0, color: Colors.yellow },
    { x: 40, y: 40, z: 20, color: Colors.yellow },
    { x: 40, y: 40, z: -20, color: Colors.yellow },

    { x: 50, y: 40, z: 0, color: Colors.ghostWhite },
    { x: 50, y: 40, z: 20, color: Colors.ghostWhite },
    { x: 50, y: 40, z: -20, color: Colors.ghostWhite },

    { x: 60, y: 40, z: 0, color: Colors.gold },
    { x: 60, y: 40, z: 20, color: Colors.gold },
    { x: 60, y: 40, z: -20, color: Colors.gold },

    { x: 70, y: 40, z: 0, color: Colors.gold },
    { x: 70, y: 40, z: 10, color: Colors.gold },
    { x: 70, y: 40, z: -10, color: Colors.gold },

    // 4
    { x: 20, y: 30, z: 0, color: Colors.gold },
    { x: 20, y: 30, z: 10, color: Colors.gold },
    { x: 20, y: 30, z: -10, color: Colors.gold },

    { x: 30, y: 30, z: 0, color: Colors.orange },
    { x: 30, y: 30, z: 20, color: Colors.orange },
    { x: 30, y: 30, z: -20, color: Colors.orange },

    { x: 40, y: 30, z: 0, color: Colors.gold },
    { x: 40, y: 30, z: 20, color: Colors.gold },
    { x: 40, y: 30, z: -20, color: Colors.gold },

    { x: 50, y: 30, z: 0, color: Colors.yellow },
    { x: 50, y: 30, z: 20, color: Colors.yellow },
    { x: 50, y: 30, z: -20, color: Colors.yellow },

    { x: 60, y: 30, z: 0, color: Colors.gold },
    { x: 60, y: 30, z: 20, color: Colors.gold },
    { x: 60, y: 30, z: -20, color: Colors.gold },

    { x: 70, y: 30, z: 0, color: Colors.gold },
    { x: 70, y: 30, z: 20, color: Colors.gold },
    { x: 70, y: 30, z: -20, color: Colors.gold },

    { x: 80, y: 30, z: 0, color: Colors.gold },
    { x: 80, y: 30, z: 10, color: Colors.gold },
    { x: 80, y: 30, z: -10, color: Colors.gold },

    // 3
    { x: 20, y: 20, z: 0, color: Colors.orange },
    { x: 20, y: 20, z: 10, color: Colors.orange },
    { x: 20, y: 20, z: -10, color: Colors.orange },

    { x: 30, y: 20, z: 0, color: Colors.orange },
    { x: 30, y: 20, z: 20, color: Colors.orange },
    { x: 30, y: 20, z: -20, color: Colors.orange },

    { x: 40, y: 20, z: 0, color: Colors.gold },
    { x: 40, y: 20, z: 20, color: Colors.gold },
    { x: 40, y: 20, z: -20, color: Colors.gold },

    { x: 50, y: 20, z: 0, color: Colors.yellow },
    { x: 50, y: 20, z: 20, color: Colors.yellow },
    { x: 50, y: 20, z: -20, color: Colors.yellow },

    { x: 60, y: 20, z: 0, color: Colors.gold },
    { x: 60, y: 20, z: 20, color: Colors.gold },
    { x: 60, y: 20, z: -20, color: Colors.gold },

    { x: 70, y: 20, z: 0, color: Colors.yellow },
    { x: 70, y: 20, z: 20, color: Colors.yellow },
    { x: 70, y: 20, z: -20, color: Colors.yellow },

    { x: 80, y: 20, z: 0, color: Colors.ghostWhite },
    { x: 80, y: 20, z: 10, color: Colors.ghostWhite },
    { x: 80, y: 20, z: -10, color: Colors.ghostWhite },

    // 2
    { x: 30, y: 10, z: 0, color: Colors.orange },
    { x: 30, y: 10, z: 10, color: Colors.orange },
    { x: 30, y: 10, z: -10, color: Colors.orange },

    { x: 40, y: 10, z: 0, color: Colors.orange },
    { x: 40, y: 10, z: 20, color: Colors.orange },
    { x: 40, y: 10, z: -20, color: Colors.orange },

    { x: 50, y: 10, z: 0, color: Colors.gold },
    { x: 50, y: 10, z: 20, color: Colors.gold },
    { x: 50, y: 10, z: -20, color: Colors.gold },

    { x: 60, y: 10, z: 0, color: Colors.gold },
    { x: 60, y: 10, z: 20, color: Colors.gold },
    { x: 60, y: 10, z: -20, color: Colors.gold },

    { x: 70, y: 10, z: 0, color: Colors.yellow },
    { x: 70, y: 10, z: 20, color: Colors.yellow },
    { x: 70, y: 10, z: -20, color: Colors.yellow },

    { x: 80, y: 10, z: 0, color: Colors.gold },
    { x: 80, y: 10, z: 10, color: Colors.gold },
    { x: 80, y: 10, z: -10, color: Colors.gold },

    // 1
    { x: 50, y: 0, z: 0, color: Colors.orange },
    { x: 50, y: 0, z: 10, color: Colors.orange },
    { x: 50, y: 0, z: -10, color: Colors.orange },

    { x: 60, y: 0, z: 0, color: Colors.orange },
    { x: 60, y: 0, z: 20, color: Colors.orange },
    { x: 60, y: 0, z: -20, color: Colors.orange },

    { x: 70, y: 0, z: 0, color: Colors.orange },
    { x: 70, y: 0, z: 10, color: Colors.orange },
    { x: 70, y: 0, z: -10, color: Colors.orange },
  ]

  for(var i = 0, len = positionArr.length; i < len; i++) {
    var { x = 0, y = 0, z = 0, color } = positionArr[i]
    x = x 
    y = y + 50
    var geomSqare = new THREE.BoxGeometry(10,10,10,1,1,1);
    var matCockpit = new THREE.MeshPhongMaterial({color:color, shading:THREE.FlatShading});
    var sqare = new THREE.Mesh(geomSqare, matCockpit);
    sqare.position.set(x, y, z);
    sqare.castShadow = true;
    sqare.receiveShadow = true;
    this.mesh.add(sqare);
  }
}


var AirPlane = function(){
	this.mesh = new THREE.Object3D();
  this.mesh.name = "airPlane";

  // 石块模拟灶台

  // 这个形状会被复制创建云

  let positionArr=[
    { x: 0, y: 6, z: 0, color: Colors.pot1 },
    { x: 3, y: 6, z: 0, color: Colors.pot1 },
    { x: -3, y: 6, z: 0, color: Colors.pot1 },

    { x: 0, y: 6, z: 3, color: Colors.pot1 },
    { x: 3, y: 6, z: 3, color: Colors.pot1 },
    { x: -3, y: 6, z: 3, color: Colors.pot1 },

    { x: 0, y: 6, z: -3, color: Colors.pot1 },
    { x: 3, y: 6, z: -3, color: Colors.pot1 },
    { x: -3, y: 6, z: -3, color: Colors.pot1 },
//第一层中--第二
    { x: 0, y: 9, z: 0, color: Colors.pot1 },
    { x: 3, y: 9, z: 0, color: Colors.pot1 },
    { x: -3, y: 9, z: 0, color: Colors.pot1 },

    { x: 0, y: 9, z: 3, color: Colors.pot1 },
    { x: 3, y: 9, z: 3, color: Colors.pot1 },
    { x: -3, y: 9, z: 3, color: Colors.pot1 },

    { x: 0, y: 9, z: -3, color: Colors.pot1 },
    { x: 3, y: 9, z: -3, color: Colors.pot1 },
    { x: -3, y: 9, z: -3, color: Colors.pot1 },
//第二层
    { x: 0, y: 9, z: 6, color: Colors.pot2 },
    { x: -3, y: 9, z: 6, color: Colors.pot2 },
    { x: -6, y: 9, z: 6, color: Colors.pot2 },
    { x: 0, y: 9, z: 6, color: Colors.pot2 },
    { x: 3, y: 9, z: 6, color: Colors.pot2 },
    { x: 6, y: 9, z: 6, color: Colors.pot2 },

    { x: 0, y: 9, z: 6, color: Colors.pot2 },
    { x: -3, y: 9, z: 6, color: Colors.pot2 },
    { x: -6, y: 9, z: 6, color: Colors.pot2 },
    { x: 0, y: 9, z: 6, color: Colors.pot2 },
    { x: 3, y: 9, z: 6, color: Colors.pot2 },
    { x: 6, y: 9, z: 6, color: Colors.pot2 },

    { x: -6, y: 9, z: 6, color: Colors.pot2 },
    { x: -6, y: 9, z: 3, color: Colors.pot2 },
    { x: -6, y: 9, z: 0, color: Colors.pot2 },
    { x: -6, y: 9, z: -3, color: Colors.pot2 },
    { x: -6, y: 9, z: -6, color: Colors.pot2 },

    { x: -6, y: 9, z: 6, color: Colors.pot2 },
    { x: -6, y: 9, z: 3, color: Colors.pot2 },
    { x: -6, y: 9, z: 0, color: Colors.pot2 },
    { x: -6, y: 9, z: -3, color: Colors.pot2 },
    { x: -6, y: 9, z: -6, color: Colors.pot2 },

    { x: 0, y: 9, z: -6, color: Colors.pot2 },
    { x: -3, y: 9, z: -6, color: Colors.pot2 },
    { x: -6, y: 9, z: -6, color: Colors.pot2 },
    { x: 0, y: 9, z: -6, color: Colors.pot2 },
    { x: 3, y: 9, z: -6, color: Colors.pot2 },
    { x: 6, y: 9, z: -6, color: Colors.pot2 },
    
    { x: 6, y: 9, z: 6, color: Colors.pot2 },
    { x: 6, y: 9, z: 3, color: Colors.pot2 },
    { x: 6, y: 9, z: 0, color: Colors.pot2 },
    { x: 6, y: 9, z: -3, color: Colors.pot2 },
    { x: 6, y: 9, z: -6, color: Colors.pot2 },
//--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=

    // //第三层
    { x: -9, y: 9, z: 9, color: Colors.pot3 },
    { x: -9, y: 9, z: 6, color: Colors.pot3 },
    { x: -9, y: 9, z: 3, color: Colors.pot3 },
    { x: -9, y: 9, z: 0, color: Colors.pot3 },
    { x: -9, y: 9, z: -3, color: Colors.pot3 },
    { x: -9, y: 9, z: -6, color: Colors.pot3 },
    { x: -9, y: 9, z: -9, color: Colors.pot3 },

    { x: -9, y: 9, z: 9, color: Colors.pot3 },
    { x: 0, y: 9, z: 9, color: Colors.pot3 },
    { x: -3, y: 9, z: 9, color: Colors.pot3 },
    { x: -6, y: 9, z: 9, color: Colors.pot3 },
    { x: 0, y: 9, z: 9, color: Colors.pot3 },
    { x: 3, y: 9, z: 9, color: Colors.pot3 },
    { x: 6, y: 9, z: 9, color: Colors.pot3 },
    {x: 9, y: 9, z: 9, color: Colors.pot3 },

    { x: -9, y: 9, z: -9, color: Colors.pot3 },
    { x: 0, y: 9, z: -9, color: Colors.pot3 },
    { x: -3, y: 9, z: -9, color: Colors.pot3 },
    { x: -6, y: 9, z: -9, color: Colors.pot3 },
    { x: 0, y: 9, z: -9, color: Colors.pot3 },
    { x: 3, y: 9, z: -9, color: Colors.pot3 },
    { x: 6, y: 9, z: -9, color: Colors.pot3 },
    {x: 9, y: 9, z: -9, color: Colors.pot3 },

    { x: 9, y: 9, z: 9, color: Colors.pot3 },
    { x: 9, y: 9, z: 6, color: Colors.pot3 },
    { x: 9, y: 9, z: 3, color: Colors.pot3 },
    { x: 9, y: 9, z: 0, color: Colors.pot3 },
    { x: 9, y: 9, z: -3, color: Colors.pot3 },
    { x: 9, y: 9, z: -6, color: Colors.pot3 },
    { x: 9, y: 9, z: -9, color: Colors.pot3 },

    //--=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
    { x: -9, y: 12, z: 9, color: Colors.linen },
    { x: -9, y: 12, z: 6, color: Colors.linen },
    { x: -9, y: 12, z: 3, color: Colors.linen },
    { x: -9, y: 12, z: 0, color: Colors.linen },
    { x: -9, y: 12, z: -3, color: Colors.linen },
    { x: -9, y: 12, z: -6, color: Colors.linen },
    { x: -9, y: 12, z: -9, color: Colors.linen },

    { x: -9, y: 12, z: 9, color: Colors.pot3 },
    { x: 0, y: 12, z: 9, color: Colors.pot3 },
    { x: -3, y: 12, z: 9, color: Colors.pot3 },
    { x: -6, y: 12, z: 9, color: Colors.pot3 },
    { x: 0, y: 12, z: 9, color: Colors.pot3 },
    { x: 3, y: 12, z: 9, color: Colors.pot3 },
    { x: 6, y: 12, z: 9, color: Colors.pot3 },
    {x: 9, y: 12, z: 9, color: Colors.pot3 },

    { x: -9, y: 12, z: -9, color: Colors.pot3 },
    { x: 0, y: 12, z: -9, color: Colors.pot3 },
    { x: -3, y: 12, z: -9, color: Colors.pot3 },
    { x: -6, y: 12, z: -9, color: Colors.pot3 },
    { x: 0, y: 12, z: -9, color: Colors.pot3 },
    { x: 3, y: 12, z: -9, color: Colors.pot3 },
    { x: 6, y: 12, z: -9, color: Colors.pot3 },
    {x: 9, y: 12, z: -9, color: Colors.pot3 },

    { x: 9, y: 12, z: 9, color: Colors.pot3 },
    { x: 9, y: 12, z: 6, color: Colors.linen },
    { x: 9, y: 12, z: 3, color: Colors.linen },
    { x: 9, y: 12, z: 0, color: Colors.linen },
    { x: 9, y: 12, z: -3, color: Colors.linen },
    { x: 9, y: 12, z: -6, color: Colors.linen },
    { x: 9, y: 12, z: -9, color: Colors.pot3 },

    // --=-=-=-=-=-=-=-=-=-=-=-=

    { x: -9, y: 15, z: 9, color: Colors.linen },
    { x: -9, y: 15, z: 6, color: Colors.linen },
    { x: -9, y: 15, z: 3, color: Colors.linen },
    { x: -9, y: 15, z: 0, color: Colors.linen },
    { x: -9, y: 15, z: -3, color: Colors.linen },
    { x: -9, y: 15, z: -6, color: Colors.linen },
    { x: -9, y: 15, z: -9, color: Colors.linen },

    { x: -9, y: 15, z: 9, color: Colors.pot3 },
    { x: 0, y: 15, z: 9, color: Colors.pot3 },
    { x: -3, y: 15, z: 9, color: Colors.pot3 },
    { x: -6, y: 15, z: 9, color: Colors.pot3 },
    { x: 0, y: 15, z: 9, color: Colors.pot3 },
    { x: 3, y: 15, z: 9, color: Colors.pot3 },
    { x: 6, y: 15, z: 9, color: Colors.pot3 },
    {x: 9, y: 15, z: 9, color: Colors.pot3 },

    { x: -9, y: 15, z: -9, color: Colors.pot3 },
    { x: 0, y: 15, z: -9, color: Colors.pot3 },
    { x: -3, y: 15, z: -9, color: Colors.pot3 },
    { x: -6, y: 15, z: -9, color: Colors.pot3 },
    { x: 0, y: 15, z: -9, color: Colors.pot3 },
    { x: 3, y: 15, z: -9, color: Colors.pot3 },
    { x: 6, y: 15, z: -9, color: Colors.pot3 },
    {x: 9, y: 15, z: -9, color: Colors.pot3 },

    { x: 9, y: 15, z: 9, color: Colors.pot3 },
    { x: 9, y: 15, z: 6, color: Colors.linen },
    { x: 9, y: 15, z: 3, color: Colors.linen },
    { x: 9, y: 15, z: 0, color: Colors.linen },
    { x: 9, y: 15, z: -3, color: Colors.linen },
    { x: 9, y: 15, z: -6, color: Colors.linen },
    { x: 9, y: 15, z: -9, color: Colors.pot3 },

    //-=-=-=-=-=-=-=-=--=-=-=-

    { x: -9, y: 18, z: 9, color: Colors.linen },
    { x: -9, y: 18, z: 6, color: Colors.linen },
    { x: -9, y: 18, z: 3, color: Colors.linen },
    { x: -9, y: 18, z: 0, color: Colors.linen },
    { x: -9, y: 18, z: -3, color: Colors.linen },
    { x: -9, y: 18, z: -6, color: Colors.linen },
    { x: -9, y: 18, z: -9, color: Colors.linen },

    { x: -9, y: 18, z: 9, color: Colors.pot3 },
    { x: 0, y: 18, z: 9, color: Colors.pot3 },
    { x: -3, y: 18, z: 9, color: Colors.pot3 },
    { x: -6, y: 18, z: 9, color: Colors.pot3 },
    { x: 0, y: 18, z: 9, color: Colors.pot3 },
    { x: 3, y: 18, z: 9, color: Colors.pot3 },
    { x: 6, y: 18, z: 9, color: Colors.pot3 },
    {x: 9, y: 18, z: 9, color: Colors.pot3 },

    { x: -9, y: 18, z: -9, color: Colors.pot3 },
    { x: 0, y: 18, z: -9, color: Colors.pot3 },
    { x: -3, y: 18, z: -9, color: Colors.pot3 },
    { x: -6, y: 18, z: -9, color: Colors.pot3 },
    { x: 0, y: 18, z: -9, color: Colors.pot3 },
    { x: 3, y: 18, z: -9, color: Colors.pot3 },
    { x: 6, y: 18, z: -9, color: Colors.pot3 },
    {x: 9, y: 18, z: -9, color: Colors.pot3 },

    { x: 9, y: 18, z: 9, color: Colors.pot3 },
    { x: 9, y: 18, z: 6, color: Colors.linen },
    { x: 9, y: 18, z: 3, color: Colors.linen },
    { x: 9, y: 18, z: 0, color: Colors.linen },
    { x: 9, y: 18, z: -3, color: Colors.linen },
    { x: 9, y: 18, z: -6, color: Colors.linen },
    { x: 9, y: 18, z: -9, color: Colors.pot3 },

    //-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
    { x: -9, y: 21, z: 9, color: Colors.linen },
    { x: -9, y: 21, z: 6, color: Colors.linen },
    { x: -9, y: 21, z: 3, color: Colors.linen },
    { x: -9, y: 21, z: 0, color: Colors.linen },
    { x: -9, y: 21, z: -3, color: Colors.linen },
    { x: -9, y: 21, z: -6, color: Colors.linen },
    { x: -9, y: 21, z: -9, color: Colors.linen },

    { x: -9, y: 21, z: 9, color: Colors.pot3 },
    { x: 0, y: 21, z: 9, color: Colors.pot3 },
    { x: -3, y: 21, z: 9, color: Colors.pot3 },
    { x: -6, y: 21, z: 9, color: Colors.pot3 },
    { x: 0, y: 21, z: 9, color: Colors.pot3 },
    { x: 3, y: 21, z: 9, color: Colors.pot3 },
    { x: 6, y: 21, z: 9, color: Colors.pot3 },
    {x: 9, y: 21, z: 9, color: Colors.pot3 },

    { x: -9, y: 21, z: -9, color: Colors.pot3 },
    { x: 0, y: 21, z: -9, color: Colors.pot3 },
    { x: -3, y: 21, z: -9, color: Colors.pot3 },
    { x: -6, y: 21, z: -9, color: Colors.pot3 },
    { x: 0, y: 21, z: -9, color: Colors.pot3 },
    { x: 3, y: 21, z: -9, color: Colors.pot3 },
    { x: 6, y: 21, z: -9, color: Colors.pot3 },
    {x: 9, y: 21, z: -9, color: Colors.pot3 },

    { x: 9, y: 21, z: 9, color: Colors.pot3 },
    { x: 9, y: 21, z: 6, color: Colors.linen },
    { x: 9, y: 21, z: 3, color: Colors.linen },
    { x: 9, y: 21, z: 0, color: Colors.linen },
    { x: 9, y: 21, z: -3, color: Colors.linen },
    { x: 9, y: 21, z: -6, color: Colors.linen },
    { x: 9, y: 21, z: -9, color: Colors.pot3 },

    //-=-=-=-=-=-=-=-=-=-

    { x: 12, y: 18, z: 3, color: Colors.gray },
    { x: 12, y: 18, z: 0, color: Colors.gray },
    { x: 12, y: 18, z: -3, color: Colors.gray },

    { x: -12, y: 18, z: 3, color: Colors.gray },
    { x: -12, y: 18, z: 0, color: Colors.gray },
    { x: -12, y: 18, z: -3, color: Colors.gray },

    { x: 14, y: 18, z: 0, color: Colors.black },
    { x: -14, y: 18, z: 0, color: Colors.black },
  ]

  for(var i = 0, len = positionArr.length; i < len; i++) {
    var { x = 0, y = 0, z = 0, color } = positionArr[i]
    y = y - 30
    var torus = new THREE.BoxGeometry(3,3,3,1,1,1);
    var matCockpit = new THREE.MeshPhongMaterial({color:color, shading:THREE.FlatShading});
    var sqare = new THREE.Mesh(torus, matCockpit);
    sqare.position.set(x, y, z);
    sqare.castShadow = true;
    sqare.receiveShadow = true;
    this.mesh.add(sqare);
  }

};



// 3D Models
var airplane, lajiao, qingjiao, jitui;

function creatLajiao() {
  lajiao = new Lajiao()
  lajiao.mesh.scale.set(.25,.25,.25);
  lajiao.mesh.position.y = 50;
  scene.add(lajiao.mesh);
}

function creatQingjiao() {
  qingjiao = new Qingjiao()
  qingjiao.mesh.scale.set(.25,.25,.25);
  qingjiao.mesh.position.y = 80;
  scene.add(qingjiao.mesh);
}

function creatJitui() {
  jitui = new Jitui()
  jitui.mesh.scale.set(.25,.25,.25);
  jitui.mesh.position.y = 100;
  scene.add(jitui.mesh);
}

function createPlane(){
  airplane = new AirPlane();
  airplane.mesh.scale.set(3,2,3);
  airplane.mesh.position.y = 100;
  scene.add(airplane.mesh);
}
var flag = false
function loop(){
 jitui.mesh.rotation.x += 0.08

 qingjiao.mesh.rotation.x -= .04

  renderer.render(scene, camera);
  requestAnimationFrame(loop);
}

// function updatePlane(){
//   var targetY = normalize(mousePos.y,-.75,.75,25, 175);
//   var targetX = normalize(mousePos.x,-.75,.75,-100, 100);
//   airplane.mesh.position.y = targetY;
//   airplane.mesh.position.x = targetX;
//   // airplane.propeller.rotation.x += 0.3;
// }

function normalize(v,vmin,vmax,tmin, tmax){
  var nv = Math.max(Math.min(v,vmax), vmin);
  var dv = vmax-vmin;
  var pc = (nv-vmin)/dv;
  var dt = tmax-tmin;
  var tv = tmin + (pc*dt);
  return tv;
}

function init(event){
  // document.addEventListener('mousemove', handleMouseMove, false);
  createScene();
  createLights();
  createPlane();
  // creatLajiao()
  creatQingjiao()
  creatJitui()
  loop();
}

// HANDLE MOUSE EVENTS

var mousePos = { x: 0, y: 0 };

function handleMouseMove(event) {
  var tx = -1 + (event.clientX / WIDTH)*2;
  var ty = 1 - (event.clientY / HEIGHT)*2;
  mousePos = {x:tx, y:ty};
}

window.addEventListener('load', init, false);

var alpha, beta, gamma,time;
window.addEventListener('deviceorientation', (e) => {
  // this.absolute = e.absolute
  alpha = parseInt(e.alpha) // 水平翻转：负数向左，正数向右
  beta = parseInt(e.beta) // 前后翻转：负数向后，正数向前
  gamma = parseInt(e.gamma) // 左右翻转：数向右，正数向左

  // document.getElementById('shuzi').innerHTML = gamma
  changeGuo(beta)
})

function changeGuo(beta) {

  if(0 < beta < 100) {
    airplane.mesh.rotation.x = beta/50
  }

  if(0 < gamma < 100) {
    airplane.mesh.rotation.z = -gamma/80
  }

}
